import React,{Component} from "react";

class Tzi extends Component{
    constructor(){
        super();
        this.state={
            tziArr:[
                {
                    title:"帖子1",
                    flg:false
                },{
                    title:"帖子2",
                    flg:false
                },{
                    title:"帖子3",
                    flg:false
                }
            ],
            
        }
    }
    render(){
        return <div className="tzi">
                {
                    this.state.tziArr.map((item,index)=>{
                        return <div key={index}>
                                <h1>{item.title}</h1>
                               {item.flg? <p className="active"  onClick={()=>{
                                    this.clickP(item,index)
                                }}>赞</p>: <p  onClick={()=>{
                                    this.clickP(item,index)
                                }}>赞</p>}
                        </div>
                    })
                }
        </div>
    }
    clickP(item,index){
        item.flg=!item.flg;
        console.log(this)
        let {tziArr}=this.state;
        tziArr.map((i,j)=>{
            if(j===index){
                return item
            }else{
               return i
            }
        })
        this.setState({tziArr})
    }
}

export default Tzi